import React,{Component} from 'react';
import { connect } from 'dva';
import {TabBar} from 'antd-mobile'
import {withRouter} from 'react-router-dom'

class NavBarItem extends Component{
    constructor(){
        super()
    }
    componentDidMount(){
        this.props.dispatch({type:'chat/getChatList'})
    }
    render(){
        var newList = this.props.data.filter((v)=>!v.hide);
        //console.log(this.props.location);
        const {pathname} = this.props.location;
        //console.log(newList);
        return(
            <React.Fragment>
                <TabBar >
                    {
                        newList.map((v)=>(
                            <TabBar.Item
                                badge={v.path == '/msg'?this.props.unread:0}
                                key={v.path}
                                title={v.text}
                                icon={{uri: require(`../../../static/images/${v.icon}.png`)}}
                                selectedIcon={{uri: require(`../../../static/images/${v.icon}-active.png`)}}
                                selected={pathname===v.path}
						        onPress={()=>{
							    this.props.history.push(v.path)
						}}
                            >

                            </TabBar.Item>
                        )
                        )
                    }
                </TabBar>
            </React.Fragment>
        )
    }
}
const mapStateProps = (state)=>{
    return{
       user:state.user.username,
       type:state.user.type,
       unread:state.chat.unread,
    }
}
export default withRouter(connect(mapStateProps)(NavBarItem));
